<template>
  <div class="wrap">
    <img :src="data.info.image" class="banner" alt="">
    <div class="content" v-html="data.info.content">
      
    </div>
  </div>
</template>
<script setup>
import { getAboutInfo } from '@/api.js'
import { onMounted , reactive } from 'vue'
const data = reactive({
  info: {}
})
const getInfo = () => {
  getAboutInfo().then(res=> {
    data.info = res.data
  })
}
onMounted(() => {
  getInfo()
})
</script>
<style scoped>
.wrap {
  width: 100%;
  min-height: 100vh;
  background: url('@/assets/about/black.png') no-repeat;
  background-size: cover;
}
.banner {
  display: block;
  width: 100%;
  margin-bottom: 38px;
}
.content {
  padding: 0 20px;
  box-sizing: border-box;
}
.line1 {
  text-indent: 2em;
  margin-bottom: 20px;
}
</style>